import React, { useEffect } from 'react'
import { connect } from 'react-redux'

function Detail(props) {
    let { show, hide } = props
    useEffect(() => {
        show()
        return () => {
            hide()
        }
    }, [show, hide])
    return (
        <div style={{ padding: '10px' }}>
            <div style={{ float: 'left' }}>Detail-{props.match.params.filmId}</div>
            <div style={{ float: 'right' }} onClick={() => {
                props.history.push('/films/nowPlaying')
            }}>返回</div>
        </div>
    )
}

const mapDispatchToProps = (dispatch) => ({
    hide: () => {
        dispatch({
            type: 'show-tabbar'
        })
    },
    show: () => {
        dispatch({
            type: 'hide-tabbar'
        })
    }
})

export default connect(null, mapDispatchToProps)(Detail)